import { Component } from "react";
import MyHeader from "./component/MyHeader/MyHeader";
import style from "./my.module.css"
import { List } from 'antd-mobile'
import {
    MovieOutline,
    TagOutline,
    VideoOutline,
    HandPayCircleOutline,
    TeamOutline,
    SetOutline
} from 'antd-mobile-icons'

export default class My extends Component {
    state = {
        arr: [
            {icon: <HandPayCircleOutline />, title:'我的小剧场'},
            {icon: <TeamOutline />, title:'影票查验'},
            {icon: <SetOutline />, title:'设置'}
        ]
    }
    render() {
        return (
            <>
                <MyHeader title="我的" onBack={this.onBackHome} />
                <div className={style.top}>
                    <img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fup.enterdesk.com%2F22%2F9f%2F4d%2F08%2F2fdc908c8763cbf8efde3a5a567875b8.jpg&refer=http%3A%2F%2Fup.enterdesk.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1654993271&t=2a42a769ae77e12b1f65e058e19fba6a" alt="" />
                    <p>c</p>
                </div>
                <div>
                    <List>
                        <List.Item prefix={<MovieOutline />} onClick={() => { }}>
                            电影票
                        </List.Item>
                        <List.Item prefix={<TagOutline />} onClick={() => { }}>
                            小食
                        </List.Item>
                        <List.Item prefix={<VideoOutline />} onClick={() => { }}>
                            演出票
                        </List.Item>
                        {this.state.arr.map((item,index)=><List.Item prefix={item.icon} onClick={() => { }} key={index}>
                            {item.title}
                        </List.Item>)}
                    </List>
                    {/* <ul>
                      <li className={style.li}>
                          <div>
                              <i style={{ fontSize:16}}><AntOutline></AntOutline></i>
                              <div>电影票</div>
                          </div>
                          <i style={{ fontSize:16}}><RightOutline /></i>
                      </li>
                  </ul> */}
                </div>
            </>
        )
    }
    onBackHome = () => {
        window.location.href = '/'
    }
}